<template>
  <van-skeleton :row="21" :loading="loading">
    <RecommendsHead :picUrl="picUrl"></RecommendsHead>
    <playList :playlist="dailyRecommendList"></playList>
  </van-skeleton>
</template>

<script>
import RecommendsHead from "@/components/RecommendSongs/recommendsHead.vue"
import {getEveryDayRecommend} from '@/api/index.js'
import playList from '@/components/playList.vue'
export default {
  data(){
    return{
      //每日推荐列表
       dailyRecommendList:{
         tracks:[]
       },
       loading:true,
    }
  },
 components:{
   RecommendsHead,playList
 },
 computed:{
  picUrl(){
    let picUrl=this.dailyRecommendList.tracks[0].al.picUrl?this.dailyRecommendList.tracks[0].al.picUrl:""
    return picUrl
  }
 },
 async created(){
   const {data:res}=await getEveryDayRecommend()
   console.log(res);
   this.dailyRecommendList.tracks=res.data.dailySongs
   //把歌曲列表放到vuex中
   this.$store.commit('setPlaylist',this.dailyRecommendList.tracks)
   this.loading=false
 },
 methods:{

 }
}
</script>

<style>

</style>